<template>
  <view class="custom-top" :style="{ height: topHeight + 'upx' }">
    <slot></slot>
  </view>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import type { Ref } from 'vue'

const topHeight: Ref<number> = ref(0);

onMounted(() => {
  // 获取系统信息
  const systemInfo = uni.getSystemInfoSync();
  // 获取状态栏高度，不同平台状态栏高度不同
  const statusBarHeightUpx = systemInfo.statusBarHeight;
  topHeight.value = statusBarHeightUpx+40;
});
</script>

<style lang="scss">
.custom-top {
  // background-color: #fff;
  z-index: 999;
  display: flex;
  align-items: center;
  justify-content: center;
}
</style>